<!DOCTYPE html>
<html style="height: 60%">

<head>
    <meta charset="utf-8">
    <link rel="stylesheet" href="../../plugins/layui/css/layui.css">
</head>

<body style="height: 100%; margin: 0">
</div>
    <div id="container" style="height: 100%"></div>

    <script src="../../plugins/layui/layui.all.js"></script>
    <script src="../../plugins/jquery/jquery.min.js"></script>
    <script type="text/javascript" src="http://echarts.baidu.com/gallery/vendors/echarts/echarts.min.js"></script>
    <script type="text/javascript" src="http://echarts.baidu.com/gallery/vendors/echarts-gl/echarts-gl.min.js"></script>
    <script type="text/javascript" src="http://echarts.baidu.com/gallery/vendors/echarts-stat/ecStat.min.js"></script>
    <script type="text/javascript"
        src="http://echarts.baidu.com/gallery/vendors/echarts/extension/dataTool.min.js"></script>
    <script type="text/javascript" src="http://echarts.baidu.com/gallery/vendors/echarts/map/js/china.js"></script>
    <script type="text/javascript" src="http://echarts.baidu.com/gallery/vendors/echarts/map/js/world.js"></script>
    <script type="text/javascript"
        src="http://echarts.baidu.com/gallery/vendors/echarts/extension/bmap.min.js"></script>
    <script type="text/javascript" src="http://echarts.baidu.com/gallery/vendors/simplex.js"></script>
    <script type="text/javascript">
        var dom = document.getElementById("container");
        var myChart = echarts.init(dom);
        var app = {};
        option = null;
        option = {
            xAxis: {
                type: 'category',
                data: ['星期一', '星期二', '星期三', '星期四', '星期五', '星期六', '星期日']
            },
            yAxis: {
                min: 0,
                max: 70,
                type: 'value'
            },
            series: [{
                data: [10, 25, 37, 40, 20, 35, 60],
                type: 'line',
                itemStyle: { normal: { label: { show: true } } }
            }]
        };
        ;
        if (option && typeof option === "object") {
            myChart.setOption(option, true);
        }
    </script>

    <script>

        layui.use('layer', function () {
            var $ = layui.jquery, layer = layui.layer;

            //触发事件
            var active = {
                confirmTrans: function () {
                    //配置一个透明的询问框
                    layer.msg('大部分参数都是可以公用的<br>合理搭配，展示不一样的风格', {
                        time: 20000, //20s后自动关闭
                        btn: ['明白了', '知道了', '哦']
                    });
                }

            };

            $('#layerDemo .layui-btn').on('click', function () {
                var othis = $(this), method = othis.data('method');
                active[method] ? active[method].call(this, othis) : '';
            });

        });
    </script>
</body>

</html>